<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<title>Games</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<script src="js/jquery.min.js"></script>
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />	
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<script src="js/modernizr.custom.js"></script>
<link rel="stylesheet" type="text/css" href="css/component.css" />
</head>
<body> 
<!--header-->	
<div class="header" >
	
	
		<div class="header-top">
		<div class="container">
		<div class="head-top">
			<div class="logo">
				<h1>游戏中心</h1>
			</div>
		<div class="top-nav">		
			  <span class="menu"><img src="images/menu.png" alt=""> </span>
				
					<ul>
						<li class="active"><a class="color1" href="/">首页</a></li>
						<li><a class="color2" href="/GameList">游戏</a></li>
						<li><a class="color4" href="/NewsList">新闻</a></li>
						<li><a class="color6" href="contact.html">联系我们</a></li>
						<div class="clearfix"> </div>
					</ul>

					<!--script-->
				<script>
					$("span.menu").click(function(){
						$(".top-nav ul").slideToggle(500, function(){
						});
					});
			</script>

				</div>
				
				<div class="clearfix"> </div>
		</div>
		</div>
	</div>
</div>

<!--content-->
	<div class="container">
			<div class="games">
				<h2>游戏</h2>
			
			<div class="wrap">	
			<div class="main">
				<ul id="og-grid" class="og-grid">
					<li th:each="g:${gameList}">
						<a th:href="${g.url}"
						   th:data-largesrc="'images/'+${g.img}"
						   th:data-title="${g.name}"
						   th:data-description="${g.expdesc}">
							<img class="img-responsive" th:src="'images/'+${g.img}" alt="img01"/>
						</a>
					</li>

					 <div class="clearfix"> </div>
					</ul>
				</div>
			</div>
		</div>
<script src="js/grid.js"></script>
		<script>
			$(function() {
				Grid.init();
			});
		</script>
	</div>
	<!---->
	<div class="footer">
	
			<p class="footer-class">Copyright &copy; 2025.Sunys</p>
			
		</div>

</body>
</html>